<!DOCTYPE html>
<html>
<head>
    {% load static %}
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>{% block title %}Zeaning Admin Examples{% endblock %}</title>
    <meta name="apple-mobile-web-app-title" content="{{ title }}"/>
    <meta name="apple-mobile-web-app-title" content="{{ title }}"/>
    <meta name="description" content="这是一个 index 页面">

    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>

    <link rel="icon" type="image/png" href="{% static "i/favicon.png" %}">
    <link rel="apple-touch-icon-precomposed" href="{% static "i/app-icon72x72@2x.png" %}">

    <link rel="stylesheet" href="{% static "css/amazeui.min.css" %}"/>
    <link rel="stylesheet" href="{% static "css/admin.css" %}">
    <link rel="stylesheet" href="{% static "css/app.css" %}">
    <script src="{% static "js/echarts.min.js" %}"></script>

    {% block extrastyle %}
        <link rel="stylesheet" type="text/css" href="{% static "css/base.css" %}"/>
    {% endblock %}
</head>

<body class="{% block bodyclass %}{% endblock %}" {% block data-type %}{% endblock %}>

{% block body-content %}

    <header class="am-topbar am-topbar-inverse admin-header">
        <div class="am-topbar-brand">
            <a href="javascript:" class="tpl-logo">
                <img src="{% static "img/logo.png" %}" alt="">
            </a>
        </div>
        <div class="am-icon-list tpl-header-nav-hover-ico am-fl am-margin-right"></div>
        <button class="am-topbar-btn am-topbar-toggle am-btn am-btn-sm am-btn-success am-show-sm-only"
                data-am-collapse="{target: '#topbar-collapse'}"><span class="am-sr-only">导航切换</span> <span
                class="am-icon-bars"></span></button>

        <div class="am-collapse am-topbar-collapse" id="topbar-collapse">

            <ul class="am-nav am-nav-pills am-topbar-nav am-topbar-right admin-header-list tpl-header-list">

                {% block topbar %}
                    <li class="am-hide-sm-only">
                        <a href="javascript:" id="admin-fullscreen" class="tpl-header-list-link"><span
                                class="am-icon-arrows-alt"></span> <span class="admin-fullText">全屏</span></a>
                    </li>
                {% endblock %}

                {% if user.is_authenticated %}
                    {% block userlinks %}
                        <li class="am-dropdown" data-am-dropdown data-am-dropdown-toggle>
                            <a class="am-dropdown-toggle tpl-header-list-link" href="javascript:">
                                <span class="tpl-header-list-user-nick">{% firstof user.get_short_name user.get_username %}</span><span
                                    class="tpl-header-list-user-ico"> <img
                                    src="{% static "img/user01.png" %}"></span>
                            </a>
                            <ul class="am-dropdown-content">
                                <li><a href="{% url "accounts:profile" %}"><span class="am-icon-bell-o"></span>
                                    资料</a></li>
                                <li><a href="{% url "accounts:password_change" %}"><span class="am-icon-cog"></span>
                                    修改密码</a></li>
                                <li><a href="{% url 'accounts:logout' %}"><span class="am-icon-power-off"></span> 退出</a>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a href="{% url 'accounts:logout' %}" class="tpl-header-list-link"><span
                                    class="am-icon-sign-out tpl-header-list-ico-out-size"></span></a>
                        </li>
                    {% endblock %}
                {% else %}
                    <li>
                        <a class="am-dropdown-toggle tpl-header-list-link" href="{% url 'accounts:login' %}">
                            <span class="am-icon-user">登录</span>
                        </a>
                    </li>
                {% endif %}

            </ul>
        </div>
    </header>


    <div class="tpl-page-container tpl-page-header-fixed">

        <div class="tpl-left-nav tpl-left-nav-hover">
            <div class="tpl-left-nav-title">
                {% block welcome-msg %}{{ user.username }}你好！{% endblock %}
            </div>

            <div class="tpl-left-nav-list">
                <ul class="tpl-left-nav-menu">
                    <li class="tpl-left-nav-item">
                        <a href="{% url 'index' %}" class="nav-link"><i class="am-icon-home"></i><span>首页</span></a>
                    </li>

                    <li class="tpl-left-nav-item">
                        <a href="{% url "statistics:index" %}" class="nav-link tpl-left-nav-link-list">
                            <i class="am-icon-bar-chart"></i><span>数据表</span><i
                                class="tpl-left-nav-content tpl-badge-danger">12</i>
                        </a>
                    </li>

                    <li class="tpl-left-nav-item">
                        <a href="javascript:" class="nav-link tpl-left-nav-link-list">
                            <i class="am-icon-table"></i>
                            <span>表格</span>
                            <i class="am-icon-angle-right tpl-left-nav-more-ico am-fr am-margin-right"></i>
                        </a>
                        <ul class="tpl-left-nav-sub-menu">
                            <li>
                                <a href="{% url "business:font-list" %}" id="table-font-list">
                                    <i class="am-icon-angle-right"></i>
                                    <span>文字表格</span>
                                    <i class="am-icon-star tpl-left-nav-content-ico am-fr am-margin-right"></i>
                                </a>

                                <a href="{% url "business:images-list" %}" id="table-images-list">
                                    <i class="am-icon-angle-right"></i>
                                    <span>图片表格</span>
                                    <i class="tpl-left-nav-content tpl-badge-success">18</i>
                                </a>

                                <a href="{% url "business:news" %}" id="form-news">
                                    <i class="am-icon-angle-right"></i>
                                    <span>消息列表</span>
                                    <i class="tpl-left-nav-content tpl-badge-primary">5</i>
                                </a>

                                <a href="{% url "business:news-list" %}" id="form-news-list">
                                    <i class="am-icon-angle-right"></i>
                                    <span>文字列表</span>
                                </a>
                            </li>
                        </ul>
                    </li>

                    <li class="tpl-left-nav-item">
                        <a href="javascript:" class="nav-link tpl-left-nav-link-list">
                            <i class="am-icon-wpforms"></i>
                            <span>表单</span>
                            <i class="am-icon-angle-right tpl-left-nav-more-ico am-fr am-margin-right tpl-left-nav-more-ico-rotate"></i>
                        </a>
                        <ul class="tpl-left-nav-sub-menu">
                            <li>
                                <a href="{% url "business:form-amazeui" %}" id="form-amazeui">
                                    <i class="am-icon-angle-right"></i>
                                    <span>Amaze UI 表单</span>
                                    <i class="am-icon-star tpl-left-nav-content-ico am-fr am-margin-right"></i>
                                </a>

                                <a href="{% url "business:form-line" %}" id="form-line">
                                    <i class="am-icon-angle-right"></i>
                                    <span>线条表单</span>
                                </a>
                            </li>
                        </ul>
                    </li>

                    <li class="tpl-left-nav-item">
                        <a href="{% url "accounts:profile" %}" class="nav-link tpl-left-nav-link-list">
                            <i class="am-icon-user"></i>
                            <span>用户设置</span>
                        </a>
                    </li>

                    <li class="tpl-left-nav-item">
                        <a href="{% url "settings:index" %}" class="nav-link tpl-left-nav-link-list">
                            <i class="am-icon-wrench"></i>
                            <span>系统设置</span>
                        </a>
                    </li>

                    <li class="tpl-left-nav-item">
                        <a href="{% url "settings:favorite" %}" class="nav-link tpl-left-nav-link-list">
                            <i class="am-icon-star"></i>
                            <span>收藏</span>
                        </a>
                    </li>

                    {% block nav-list %}
                    {% endblock %}
                </ul>
            </div>
        </div>

        <div class="tpl-content-wrapper">
            {% block pretitle %}
                <div class="tpl-content-page-title">
                    {{ page_title }}
                </div>
            {% endblock %}

            {% block breadcrumbs %}
                <ol class="am-breadcrumb">
                    {#                <li><a href="{% url "index" %}" class="am-icon-home">首页</a></li>#}
                    {#                <li><a href="#">分类</a></li>#}
                    <li class="am-active">首页</li>
                </ol>
            {% endblock %}

            {% block content %}
                {{ content }}
            {% endblock %}
        </div>
    </div>

    {% block footer %}
        <div id="footer"></div>{% endblock %}

{% endblock %}

{% block scripts %}
    <script src="{% static "js/jquery.min.js" %}"></script>
    <script src="{% static "js/amazeui.min.js" %}"></script>
    <script src="{% static "js/iscroll.js" %}"></script>
    <script src="{% static "js/app.js" %}"></script>

    <script>
        {% block blockactivenav %}
            $("ul.tpl-left-nav-menu li.tpl-left-nav-item:eq(0) a").addClass("active");
        {% endblock %}
        {% block script-add %}
        {% endblock %}
    </script>
{% endblock %}
</body>
</html>